<template>
  <div class="app-container">
    <el-button type="text" @click="dialogVisible = true">点击打开 Dialog</el-button>

    <el-dialog
      title="提示"
      :visible.sync="dialogVisible"
      width="30%"
      :before-close="handleClose">
      <span>这是一段信息</span>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="dialogVisible = false">确 定</el-button>
      </span>
    </el-dialog>

    <el-input-number class="is-controls-right" size="small"
                     v-model="num3" :min="1" :max="10"></el-input-number>
  </div>
</template>

<script>
  import {constantRouterMap} from '@/router/index'

  export default {
    data() {
      return {
        dialogVisible: false,
        num3:2
      };
    },
    methods: {
      handleClose(done) {
        this.$confirm('确认关闭？')
          .then(_ => {
            done();
          })
          .catch(_ => {});
      }
    },
    created:function () {
      console.log(constantRouterMap);
    }
  };
</script>

<style lang="scss">
  /*同一边加减框*/
  .el-input-number.is-controls-right .el-input-number__decrease{
    right: 1px;
    bottom: 1px;
    top: auto;
    left: auto;
    border-right: none;
    border-left: 1px solid #d8dce5;
    border-bottom: 1px solid #d8dce5;
    border-radius: 0 0 4px 0;
  }

  .el-input-number.is-controls-right .el-input-number__decrease, .el-input-number.is-controls-right .el-input-number__increase {
    height: auto;
    line-height: 14px;
  }

  .el-input-number__decrease.is-disabled, .el-input-number__increase.is-disabled {
    color: #b4bccc;
    cursor: not-allowed;
  }
  .el-input-number.is-controls-right .el-input-number__increase {
    border-radius: 0 4px 0 0;
    border-bottom: 1px solid #d8dce5;
  }
  .el-input-number__increase {
    right: 1px;
    border-radius: 0 4px 4px 0;
    border-left: 1px solid #d8dce5;
  }
</style>
